/*********************************menu**********************************/
#main-menu {padding-top:24px;}
.menu {padding-left:10px;}
.menu li {
	float:left; 
	position:relative;
	padding: 0 20px;
	font-family: 'Open Sans', sans-serif;
	font-size:18px;
	line-height:22px;
	font-weight:300;
}
.menu li.li-pad {margin-left:304px;}
.menu li.last {padding-right:0px;}
.menu li a {
	display:block;
	color:#414141;
	position:relative;
	text-decoration:none;
	padding:0;
}
.menu > li > a:hover,
.menu > li.active > a,
.menu > li.sfHover > a {color:#28c0ff;background-color:transparent;}

.menu li:hover {visibility:	inherit; }

.menu > li:hover a span,
.menu > li.active a span,
.menu > li.sfHover a span {
	position:absolute;
	display:inline-block;
	border-top:5px solid #28c0ff;
	background:url(../images/corner.png) center top no-repeat;
	top:-56px;
	left:0;
	margin: 0;
	height:5px;
	width:100%;
}

.menu li a span.sf-sub-indicator {display:none;}

/******************************** submenu **************************************/

.menu ul {
	position: absolute;
	top: -999em;
	min-width:180px;
	padding: 0;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

.menu li li {
	float:none;
	background:none;
	font-size: 18px;
	line-height: 22px;
	padding: 0;
}

.menu li li strong.corner {
	display:block;
	background:url(../images/corner-2.png) center 0 no-repeat;
	height:7px;
	margin-bottom:-1px;
	position:relative;
	z-index:9;
}

.menu li li a.current {font-weight:bold;}
.menu li li a {
	display:block;
	background:#fff;
	color:#414141;
	border: 1px solid #dfdfdf;
	border-top:none;
	text-align:center;
	padding: 15px 0;
}
.menu li li:first-child a {
	border-top: 1px solid #dfdfdf;
}

.menu li:hover ul, .menu li.sfHover ul {
	left: -50%;
	top: 38px;
	z-index: 999;
}
ul.menu li:hover li ul, ul.menu li.sfHover li ul {
	top:			-999em;
}

.menu li li a:hover,
.menu li li.sfHover > a {color:#fff;background:#28C0FF;}

@media only screen and (min-width: 768px) and (max-width: 959px) {
	#main-menu{ padding-top:60px; width:748px;}
	.menu li a { font-size:20px; line-height:24px; letter-spacing:0; }
	.menu ul { padding:15px; }
	.menu li:hover ul, .menu li.sfHover ul { top:20px; }
	.menu li li { padding-bottom:0px; }
	.menu li li a { font-size:15px; line-height:18px; }
	.menu li.li-pad {margin-left:0;}
	.menu > li:hover a span,
	.menu > li.active a span,
	.menu > li.sfHover a span {top:-92px;}
}
@media only screen and (max-width: 767px) {
	#main-menu{width:300px;padding: 76px 0 0;}
	.menu { float:none; padding:0; }
	.menu li { font-size:20px; line-height:24px; float:none;padding:0 0 1px;}
	.menu li a,
	.menu li li a	{
		border:1px solid #DFDFDF;
		display:block !important;
		text-align:left;
		padding: 5px 15px !important;
	}
	.menu li.li-pad {margin-left:0;}
	.menu > li > a:hover,
	.menu > li > a.active,
	.menu > li.sfHover > a,
	.menu li li a:hover,
	.menu li li.sfHover > a {color:#FFF;background:#28C0FF;}
	.menu ul {position:relative !important;top:0 !important;left: 0 !important;width:290px;padding: 0 0 0 10px;}
	.menu li li {padding-bottom:1px;}
	.menu li a span.sf-sub-indicator {
		position:absolute;
		display:inline-block;
		background:url(../images/marker-1.gif) 0 0 no-repeat;
		text-indent:-5000px;
		right: 20px;
		top: 15px;
		height:6px;
		width:5px;
	}
	.menu li a:hover span.sf-sub-indicator { background-position: 0 -68px; }
	.menu > li:hover a span, .menu > li.active a span, .menu > li.sfHover a span {display:none;}
	.menu li li strong.corner {display:none;}

}
@media only screen and (min-width: 480px) and (max-width: 767px) {
	#main-menu{ padding-top: 83px; width:420px;}	
	.menu ul {width:410px;}
	
}